﻿
@{
    ViewBag.Title = "Sign In";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

@section head {
    <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700,300' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="~/Content/css/bootstrap.min.css">
    <link rel="stylesheet" href="~/Content/css/animate.css">
    <link rel="stylesheet" href="~/Content/css/signstyle.css">

    <!-- Modernizr JS -->
    <script src="~/Content/js/modernizr-2.6.2.min.js"></script>
    <!-- FOR IE9 below -->
    <!--[if lt IE 9]>
    <script src="~/Content/js/respond.min.js"></script>
    <![endif]-->
    <script type="text/javascript" src="http://pv.sohu.com/cityjson?ie=utf-8" charset="utf-8"></script>
}
<div class="container">
    <div class="row">
        <div class="col-md-4 col-md-offset-4">
            <!-- Start Sign In div -->
            <div class="fh5co-form animate-box" data-animate-effect="fadeIn">
                <h2>Sign In</h2>
                <div class="form-group">
                    <label for="username" class="sr-only">Username</label>
                    <input type="text" class="form-control" maxlength="10" id="username" placeholder="Username" autocomplete="off">
                </div>
                <div class="form-group">
                    <label for="password" class="sr-only">Password</label>
                    <input type="password" class="form-control" id="password" placeholder="Password" maxlength="16" autocomplete="off">
                </div>
                @*<div class="form-group">
                    <label for="remember"><input type="checkbox" id="remember"> Remember Me</label>
                </div>*@
                <div class="form-group">
                    <p>Not registered? <a href="/User/Register">Sign Up</a> | <a href="/User/ForgotPwd">Forgot Password?</a></p>
                </div>
                <div id="msg" class="form-group">
                    <div class="alert alert-warning" role="alert"></div>
                </div>
                <div class="form-group">
                    <button id="btnLogin" class="btn btn-primary"><span>Sign In</span></button>
                </div>
            </div>
            <!-- END Sign In div -->
        </div>
    </div>
</div>
<!-- Bootstrap -->
<script src="~/Content/js/bootstrap.min.js"></script>
<!-- Placeholder -->
<script src="~/Content/js/jquery.placeholder.min.js"></script>
<!-- Waypoints -->
<script src="~/Content/js/jquery.waypoints.min.js"></script>
<!-- Main JS -->
<script src="~/Content/js/main.js"></script>
<script>
    $(function () {
        $("#msg").hide();
    });
    //用户登录
    $("#btnLogin").click(function () {
        var name = $("#username").val();
        var password = $("#password").val();
        if (name.length == 0 || password.length == 0) {
            $("#msg").show().find('div').html("Username or password can't be empty!");
            return;
        }
        var i = returnCitySN;
        var userIP = i['cip'];
        var userCity = i['cname'];
        $("#btnLogin").attr('disabled', 'true');
        $("#btnLogin").find('span').html("Loading...");
        $.ajax({
            url: "/User/Login", dataType: "json",
            type: "post", data: { userName: name, passWord: password, IP: userIP, City: userCity },
            success: function (res) {
                if (res.Status == "OK") {
                    location.href = "/Home/Index";//如果登录成功，则自动跳转到首页
                } else {
                    $("#msg").show().find('div').html(res.ErrorMsg);
                    $("#btnLogin").find('span').html("Sign In");
                    $("#btnLogin").removeAttr("disabled");
                }
            }, error: function () {
                $("#msg").show().find('div').html("Network error");
                $("#btnLogin").find('span').html("Sign In");
                $("#btnLogin").removeAttr("disabled");
            }
        });
    });
</script>

